<template>
    <div>
		<div class="chen-padding">
			<mescroll-vue ref="mescroll0" :up="getMescrollUp(0)" @init="mescrollInit0">
				<!-- <mt-loadmore :bottom-method="loadBottom"  :bottom-all-loaded="allLoaded" ref="loadmoredetail"> -->
				<div id="dataList0">
				 <div v-for="(item,index) in tab0.list" :key="index">
					 <p class="p1">{{item.addtime}}</p>
					 <div class="top">
						 <p>{{item.title}}</p>
						 <div class="bto">
               <img src="../../../src/assets/img/person/youhuijuan.png" alt="">
               <p>{{item.content}}</p>
             </div>
					 </div>
				 </div>
				</div>
			</mescroll-vue>
		</div>

		<van-button type="default" class="but" @click.native="youhui()">我的优惠券</van-button>

    </div>
</template>

<script>
	import MescrollVue from 'mescroll.js/mescroll.vue'
    export default {
        name: "Tongzhi",
        components: {
          MescrollVue
        },
      data(){
          return{
						imgSrc: require("../../assets/img/kongbai.png"),
            tabType: 0 ,// 菜单类型
            tab0: {mescroll: null, list: [], isListInit: false}, // 全部
            chenload:false,
            arr:[],
            allLoaded:false,
            page:1,
          }
      },
      methods:{
          youhui(){
            this.$router.push({
              path:'/youhui'
            })
          },
          mescrollInit0 (mescroll) {
            mescroll.tabType = 0; // 加入标记,便于在回调中取到对应的list
            this.tab0.mescroll = mescroll;
          },
          getMescrollUp (tabType) {
            let emptyWarpId = 'dataList' + tabType;
            return {
            auto: true,
            callback: this.upCallback, // 上拉回调,此处可简写; 相当于 callback: function (page) { upCallback(page); }
            noMoreSize: 5, // 如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
                 empty: {
                 warpId: 'dataList0', // 父布局的id;
                 icon: this.imgSrc, // 图标,默认null
                 tip: '暂未有任何通知', // 提示

                 },
            }
          },
          upCallback (page, mescroll) {
            if (mescroll.tabType === 0) {
            // 全部
            this.tab0.isListInit = true;// 标记列表已初始化,保证列表只初始化一次
              this.axios.get(this.$store.state.url +'User/accountMsg',{
                 params:{
                  page: page.num,
                  limit:page.size
                 }
               }).then(res=>{
                        // console.log(res.data.data.class)
                this.chenload = true;
                if(res.data.errcode==0||res.data.errcode=='0'){
                    var curPageData = res.data.data.msgs;
                    mescroll.endSuccess(curPageData.length);// 联网成功的回调,隐藏下拉刷新和上拉加载的状态;
                     if (page.num === 1) this.tab0.list = []; // 如果是第一页需手动制空列表
                     this.tab0.list = this.tab0.list.concat(curPageData); // 追加新数据
                     // this.tab0.list=res.data.data.order
                }

              })
            }
          },
      },
			mounted(){
				this.sdk.getJSSDK('','',this.$store.state.url);	
			}
    }
</script>

<style scoped>
  .kong{
    width: 2.8rem;
    margin-top: 36%;
  }
  .p1{
    text-align: center;
    font-size:0.26rem;
    font-weight:500;
    color:rgba(153,153,153,1);
    margin-top: 0.3rem;
  }
  .top{
    width: 100%;
    background: #fff;
    padding: 0.3rem 0.4rem 0.28rem 0.3rem;
    margin-top: 0.2rem;
  }
  .top p:nth-child(1){
    font-size:0.3rem;
    font-weight:500;
    color:rgba(51,51,51,1)
  }
  .bto{
    margin-top: 0.3rem;
  }
  .bto img{
    width: 0.66rem;
    height: 0.58rem;
    margin-top: 0.05rem;
   float: left;
  }
  .bto p{
    font-size:0.26rem;
    font-weight:500;
    color:rgba(153,153,153,1);
    line-height:0.34rem;
    margin-left: 0.86rem;
  }
	.chen-padding{
		padding-bottom: 1rem;
	}
  .but{
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 0.88rem;
    box-shadow:0 -0.03rem 0.05rem 0 rgba(71,68,80,0.06);
    font-size:0.36rem;
    color:rgba(51,51,51,1);
  }
</style>
